﻿@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <title>登录</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="/style/images/vs.ico" type="image/x-icon" />
    <link href="~/Style/css/semantic.min.css" rel="stylesheet" />
    <link href="~/Style/css/style.css" rel="stylesheet" />
    <script src="~/Style/js/jquery.min.js"></script>
    <script src="~/Style/js/jquery.migrate.js"></script>
    <script>
        if (window.top != window) {
            window.top.location.href = '/user/login';
        }
    </script>
</head>
<body id="login-page">
    <div class="parallax-overlay"></div>
    <div class="ui five column stackable grid login-div">
        <div class="column"></div>
        <div class="column"></div>
        <div class="column" style="z-index:2">
            <div class="ui attached message">
              <div class="header">
                <img src="../../Style/images/logo.png" alt="" />
              </div>
              @*<p>Fill out the form below to sign-up for a new account</p>*@
            </div>
            <div class="ui fluid form segment attached">
                <div class="field">
                    <label>用户名</label>
                    <div class="ui left icon input">
                        <input type="text" id="username" name="username" placeholder="手机号/邮箱/用户名">
                        <i class="user icon"></i>
                    </div>
                </div>
                <div class="field">
                    <label>密码</label>
                    <div class="ui left icon input">
                        <input type="password" id="password" name="password" placeholder="密码">
                        <i class="lock icon"></i>
                    </div>
                </div>
                @*<div class="field">
                    <label>验证码</label>
                    <div class="ui left icon input action">
                        <input type="text" id="code" name="password">
                        <i class="qrcode icon"></i>
                        <div class="ui button" style="padding:0"><img src="~/Style/images/GetCaptcha.png"/></div>
                    </div>
                </div>*@
                <div class="inline field">
                    <div class="ui checkbox">
                        <input name="rememberme" type="checkbox">
                        <label>记住我</label>
                    </div>
                </div>
                <div style="text-align:center;">
                    <div class="ui large buttons">
                        <div class="ui button teal submit"><i class="icon sign in"></i>登录</div>
                        <div class="or"></div>
                        <div class="ui button green">注册</div>
                    </div>
                </div>
            </div>
            <div class="ui bottom attached warning message">
              <i class="icon warning sign"></i>
              本系统只兼容高级浏览器 <a href="#">点击下载</a>.
            </div>
        </div>
        <div class="column"></div>
        <div class="column"></div>
    </div>
    <script src="~/Style/js/semantic.min.js"></script>
    <link href="~/Style/plus/dialog/css/semantic.dialog.css" rel="stylesheet" />
    <script src="~/Style/plus/dialog/semantic.dialog.js"></script>
    <script>
        $(function () {
            $('.ui.checkbox').checkbox();
            $('.ui.form').form({
                username: {
                    identifier: 'username',
                    rules: [
                      {
                          type: 'empty',
                          prompt: '请输入用户名'
                      }
                    ]
                },
                password: {
                    identifier: 'password',
                    rules: [
                      {
                          type: 'empty',
                          prompt: '请输入密码'
                      },
                      {
                          type: 'length[6]',
                          prompt: '密码长度最少6位'
                      }
                    ]
                },
                code: {
                    identifier: 'code',
                    rules: [
                      {
                          type: 'empty',
                          prompt: '请输入验证码'
                      }
                    ]
                }
            },
            {
                inline: true,
                on: 'blur',
                onSuccess: function () {
                    return false;
                }
            });

            $('.submit').click(function () {
                login();
            });
        })

        function login() {
            var username = $('#username').val();
            var password = $('#password').val();
            if (username == '' || password == '') {
                return;
            }
            $.ajax({
                url: '/user/auth',
                type: 'psot',
                dataType: 'json',
                data: { username: username, password: password },
                cache: false,
                timeout: 30000,
                beforeSend: function () {
                    $('.submit i').removeClass(' sign in').addClass(' loading spinner');
                },
                success: function (data) {
                    $('.submit i').removeClass(' loading spinner').addClass(' sign in');
                    if (data.code == 0) {
                        window.location.href = '@ViewBag.RetUrl' || '/';
                    }
                    else {
                        dlg.Msg.Err(data.msg);
                    }
                },
                error: function (a, b, c) {
                    qibu.msgbox.hide();
                }
            })
        }
    </script>
</body>
</html>